<template>
  <!-- 电梯管理 -- 机构管理 -- 添加机构-->
  <div class="page-operate addOrganization">
    <!-- 位置模块 -->
    <HeadTop></HeadTop>
    <div class="page-head">
      <span class="operate-text">权限查看</span>
      <div class="operate-box">

        <button class="submit" style="margin-right: 10px" @click="goToUrl">修改权限</button>
        <button @click="back">返回</button>
      </div>
    </div>
    <div class="content-area">
      <div class="main-content form-edit perm-content">
        <!--content start-->
        <div class="perm-box">
          <p>
            <span class="sp-mgR5">机构名称:</span>
            <span class="sp-value">{{name}}</span>
          </p>
          <p>
            <span class="sp-mgR5">机构类型:</span>
            <span class="sp-value">{{organName}}</span>
          </p>
          <p v-show="showNotice">该机构暂时没有权限分配,如需分配权限,请点击修改权限</p>
          <div class="form-box">
            <el-tree
              class="filter-tree"
              :data="userAuthorityTreeData"
              :props="defaultProps"
              default-expand-all
              ref="tree">
            </el-tree>
          </div>
        </div>
        <!--content end-->
      </div>
    </div>
  </div>
</template>
<style scoped lang="scss" type="text/scss">
  @import '../../../../style/entry/components/pageChildCommon';
  @import '../../../../style/entry/page/permission';
</style>
<script>
  import com from '../../../../js/common'
  import HeadTop from "../../../../components/head-top/head-top"

  import {getOrganPower, getOrganDetail, getOrganTypeList} from '@/api/getData'

  export default {
    components: {
      HeadTop
    },
    data() {
      return {
        userAuthorityTreeData: [],
        defaultProps: {
          children: 'list',
          label: 'name'
        },
        name: '',
        organName: '',
        showNotice: false
      }
    },
    created() {
      this.organId = this.$route.query.organId
      this.getPageData()
    },
    methods: {
      // 获取页面所需数据
      getPageData() {
        this.getOrganPower()
        this.getOrganMsg()
        // this.getOrganLists()
      },
      // 获取机构权限信息
      getOrganPower() {
        const organId = this.$route.query.organId
        getOrganPower({
          id: organId
        }).then((pow) => {
          this.resolveUserAuthorityTree(pow.data.data)
        }).catch(err => this.$message.error(err.data.message))
      },
      // 获取机构信息
      getOrganMsg() {
        const organId = this.$route.query.organId
        getOrganDetail({
          id: organId
        }).then((msg) => {
          this.name = msg.data.data.name
          this.getOrganLists(msg)
        }).catch(err => this.$message.error(err.data.message))
      },
      // 获取机构类型列表
      getOrganLists(msg) {
        getOrganTypeList({}).then((list) => {
          const arr = list.data.data
          arr.map((val) => {
            if (val.value === msg.data.data.type) {
              this.organName = val.key
            }
          })
        }).catch(err => this.$message.error(err.data.message))
      },
      // 解析成权限树
      resolveUserAuthorityTree(authorityArr) {
        let authorityArrObj = new Map()
        let authorityTreeArr = []
        authorityArr.map((currentValue) => {
          // 将当前code存储于map中
          let code = currentValue.code
          authorityArrObj[code] = currentValue
          // 根据code值长度为3时直接push,靠引用
          if (currentValue.code.length === 3) {
            authorityTreeArr.push(authorityArrObj[code])
          } else {
            let parentid = currentValue.code.substring(0, currentValue.code.length - 3)
            // 当存在父节点也被选中时,删除父组件
            if (authorityArrObj[parentid].list) {
              authorityArrObj[parentid].list.push(currentValue)
            }
            else {
              authorityArrObj[parentid].list = []
              authorityArrObj[parentid].list.push(currentValue)
            }
          }

        })

        this.userAuthorityTreeData = authorityTreeArr
        if (authorityTreeArr.length === 0) {
          this.showNotice = true
        }
      },
      // 去编辑页
      goToUrl() {
        this.$router.push(`/manage/systemMgr/organMgr/addOrgan/editPermission?organId=${this.organId}`)
      },
      // 返回上一级
      back() {
        this.$router.go(-1);
        // 导航栏同时信息返回上级
      },
    }
  }
</script>
